<script type="text/javascript">
$(document).ready(function () {    
	$("#nhomnhac_them").jqxButton({ theme:theme, width: 80, height: 45 });
	$("#nhomnhac_xoa").jqxButton({ theme:theme, width: 80, height: 45 });
	$("#nhomnhac_capnhat").jqxButton({ theme:theme, width: 80, height: 45  });
	$("#nhomnhac_huythaotac").jqxButton({ theme:theme, width: 80, height: 45  });
	$("#nhomnhac_luu").jqxButton({ theme:theme, width: 80, height: 45  });
        $("#nhomnhac_themthanhvien").jqxButton({ theme:theme, width: 80, height: 45  });
        $("#nhomnhac_roinhom").jqxButton({ theme:theme, width: 80, height: 45  });
        
        $("#nhomnhac_them").bind("click", function(){
            $("#action").val("insert");
            $("#nhomnhac_congcu").setTrangThai(true);
        });
        $("#nhomnhac_capnhat").bind("click", function(){
            var selectedrowindex = $("#nhomnhac_danhsach").jqxGrid('getselectedrowindex');
            if(selectedrowindex<0){
                alert("Chưa có nhóm nhạc nào được chọn");
            }else{
                $("#action").val("edit");
                $("#nhomnhac_congcu").setTrangThai(true);
            }
        });
        $("#nhomnhac_xoa").bind("click", function(){
            var selectedrowindex = $("#nhomnhac_danhsach").jqxGrid('getselectedrowindex');
            if(selectedrowindex<0){
                alert("Chưa có nhóm nhạc nào được chọn");
            }else{
                var rowscount = $("#nhomnhac_danhsach").jqxGrid('getdatainformation').rowscount;
                if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
                    var data = $('#nhomnhac_danhsach').jqxGrid('getrowdata', selectedrowindex);
                    var confirmMessage = confirm("Bạn có chắc muốn xóa nhóm nhạc: " + data["ten_nhom"] + "?");
                    var manhom=data["ma_nhom"];
                    if (confirmMessage) $("#nhomnhac_danhsach").jqxGrid('deleterow', manhom);    
                }
            }
        });
        $("#nhomnhac_huythaotac").bind("click", function(){
            $("#nhomnhac_congcu").setTrangThai(false);
        });
        $("#nhomnhac_luu").bind("click", function(){
            $("#nhomnhac_thongtin").jqxValidator('validate');
            var isSuccess = $('#nhomnhac_thongtin').data("isSuccess");
            if (isSuccess){
                //khong co lõi xay ra
                var action = $("#action").val();
                if (action == "insert"){
                    var datarow = generaterow(null);                
                    $("#nhomnhac_danhsach").jqxGrid('addrow', null, datarow);
                    $("#nhomnhac_anhdaidien_upload_form").submit();
                    console.log('added new row');
                }
                else if (action == "edit"){
                    //lay ra index cua HANG duoc chon
                    var selectedrowindex = $("#nhomnhac_danhsach").jqxGrid('getselectedrowindex');
                    //dem so luong hang cua list
                    var rowscount = $("#nhomnhac_danhsach").jqxGrid('getdatainformation').rowscount;
                    //neu hang do hop le
                    if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
                        //lay id cua nhom nhac
                        var ma_nhom_nhac = $("#nhomnhac_danhsach").jqxGrid('getrowid', selectedrowindex);

                        //dat gia tri cho the input id=nghesi_id, de no submit cung voi form
                        $("#nhomnhac_id").val(ma_nhom_nhac);
                        $("#nhomnhac_anhdaidien_upload_form").submit();

                        //tao du lieu, lay du lieu tu cac input trong form, va gan id
                        var datarow = generaterow(ma_nhom_nhac);
                        //cho grid update du lieu
                        $("#nhomnhac_danhsach").jqxGrid('updaterow', ma_nhom_nhac, datarow);
                    }
                }
                $("#nhomnhac_congcu").setTrangThai(false);
            }
           
        });
        $("#nhomnhac_themthanhvien").bind("click", function(){
            $('#thanhviennhom_xacnhan').setMessage("Nhập ngày tham gia nhóm");
            $('#thanhviennhom_xacnhan').data("action", "themthanhvien");
            $('#thanhviennhom_xacnhan').jqxWindow('open');
        });
        $("#nhomnhac_roinhom").bind("click", function(){
            $('#thanhviennhom_xacnhan').setMessage("Nhập ngày rời nhóm");
            $('#thanhviennhom_xacnhan').data("action", "xoathanhvien");
            $('#thanhviennhom_xacnhan').jqxWindow('open');
        });
        $.fn.setTrangThai = function (condition){
            //condition de chi ra trang thai moi cua form,
            //true se disable nut sua, them, xoa, va false se unlock tui no ra
            //cac nut
            $("#nhomnhac_them").jqxButton({"disabled": condition});
            $("#nhomnhac_capnhat").jqxButton({"disabled": condition});
            $("#nhomnhac_xoa").jqxButton({"disabled": condition});
            $("#nhomnhac_themthanhvien").jqxButton({"disabled": condition});
            $("#nhomnhac_roinhom").jqxButton({"disabled": condition});
            $("#nhomnhac_huythaotac").jqxButton({"disabled": !condition});
            $("#nhomnhac_luu").jqxButton({"disabled": !condition});
            //cac truong nhap lieu
            $("#nhomnhac_danhsach").jqxGrid({ disabled: condition});
            $("#tennhom").jqxInput({"disabled": !condition});
            $("#thongtin").jqxInput({"disabled": !condition});
            $("#ngaythanhlap").jqxDateTimeInput({"disabled": !condition});
            $("#tennhom").jqxInput({"disabled": !condition});
        };
    
        $("#nhomnhac_congcu").setTrangThai(false);
        var generaterow = function (ma_nhom) {
            var row = {};
            row["manhom"] = ma_nhom;
            row["tennhom"] = $('#tennhom').val();
            //lay gia tri cua #ngaysinh
            var ngaythanhlap_unformated = $('#ngaythanhlap').jqxDateTimeInput('value');
            var date = ngaythanhlap_unformated.getDate().toString();
            var month = ngaythanhlap_unformated.getMonth().toString();
            var year = ngaythanhlap_unformated.getFullYear().toString();
            //theo dung dinh dang cua mysql nam/thang/ngay
            var ngaythanhlap_formated = year + "-" + month + "-" + date;
            
            row["ngaythanhlap"] = ngaythanhlap_formated;

            row["thongtin"] = $('#thongtin').val();
            return row;
       };
});
</script>
<div id="nhomnhac_congcu" style="width: 80; height: auto; float: left">
    <div>
        <div>
                <input id="nhomnhac_them" type="button" value="Thêm" />
        </div>
        <div>
                <input id="nhomnhac_xoa" type="button" value="Xóa" />
        </div>
        <div>
                <input id="nhomnhac_capnhat" type="button" value="Sửa" />
        </div>
        <div>
                <input id="nhomnhac_huythaotac" type="button" value="Hủy" />
        </div>
        <div>
                <input id="nhomnhac_luu" type="button" value="Lưu" />
        </div>
        <div>
                <input id="nhomnhac_themthanhvien" type="button" value="Thêm &#10;thành viên" />
        </div>
        <div>
            <input id="nhomnhac_roinhom" type="button" value="Rời nhóm" />
        </div>
    </div>
</div>